<template>
	<view class="page-box uni-bg-color-grey">
		<!-- 导航栏 -->
		<nav-bar v-if="isPlatform" leftText="电商平台" rightIcon='iconsaoma' backgroundColor='#1296db' color="#fff" :statusBar="true" :fixed='true'>
			<search-bar slot="center"></search-bar>
		</nav-bar>
		<!-- 搜索栏 -->
		<view class="search-bar uni-bg-color" v-else><search-bar></search-bar></view>
		<!-- swiper -->
		<swiper-bar :array="adver_list"></swiper-bar>
		<!-- 新品推荐 -->
		<view class="model-bar page-box">
			<title-bar title='新品推荐'></title-bar>
			<view class="model-list-bar uni-bg-color">
				<navigator hover-class='none' class="new-list-item" :url="`/pagesGoods/goods-details/goods-details?id=${item.id}`" v-for="(item, index) in new_goods" :key="index">
					<goods-item-bar :title="item.title" :imgSrc="path + item.img" :price='item.price'></goods-item-bar>
				</navigator>
			</view>
		</view>
		<!-- 全部商品 -->
		<goods-list-bar title="全部商品" background="#fff" :array="goods_list"></goods-list-bar>
		<!-- 加载更多 -->
		<uni-load-more :status="load"></uni-load-more>
	</view>
</template>

<script>
	export default {
		computed: {
			// 判断平台是否包含导航栏
			isPlatform() {
				//#ifdef APP-PLUS || APP-PLUS-NVUE || H5
				return true
				//#endif
				//#ifdef MP-WEIXIN
				return false
				//#endif
			}
		},
		components: {
		},
		methods: {
			// 上拉加载
			onReachBottom() {
				if(!this.forbidLoad) return false;
				if(this.timer != null) {
					clearTimeout(this.timer)
				}
				this.load = 'loading'
				this.page++
				this.timer = setTimeout( () => {
					this.getHome()
				}, 1000)
			},
			// 首页加载
			getHome() {
				const data = {
					page: this.page,
					rows: this.rows
				}
				this.$Request(this.$API.getHome, data).then(res => {
					if(res.goods_list.length){
						this.load = 'more'
					}else{
						this.load = 'noMore'
						this.forbidLoad = false
					}
					this.adver_list = res.adver_list
					this.new_goods = res.new_goods
					this.goods_list = this.goods_list.concat(res.goods_list)
				})
			}
		},
		data() {
			return {
				load: 'more',					// more（loading前）、loading（loading中）、noMore（没有更多了）
				forbidLoad: true,				// 禁止上拉加载
				timer: null,					// 上拉加载标记
				adver_list: [],					// 广告数据
				new_goods: [],					// 新品数据
				goods_list: [],					// 全部商品数据
				path: '',						// 路径
				page: 1,						// 页码
				rows: 2							// 页数
			}
		},
		mounted() {
			this.path = this.$Path
			this.getHome()
		},
		onLoad() {
		
		},
	}
</script>

<style lang="scss" scoped>
	.model-bar{
		margin-top: 30upx;
		box-shadow: 2upx 2upx 10upx 0upx rgba(0, 0, 0, 0.2);
		.model-list-bar{
			width: 100%;
			padding: 10upx 20upx;
			box-sizing: border-box;
			display: flex;
			justify-content:space-between;
		}
		.new-list-item{
			width: 25%;
		}
		.like-list-bar{
			flex-wrap: wrap;
		}
		.like-list-item{
			width: 50%;
			margin-bottom: 20upx;
		}
	}
</style>
